<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<script type="text/javascript" src="${pageContext.request.contextPath }/statics/js/jquery-3.5.1.js"></script>
<script type="text/javascript">
	$(function(){
		start(1);
	});

	function pageChange(ppp){
		start(ppp);
	}
	
	var jsonObj={
		"pn":1,
	};
	function start(oooo){
		jsonObj.pn=oooo;
		$.ajax({
			type:"post",
			url:"${pageContext.request.contextPath}/process/index.do",
			data:jsonObj,
			success:function(result){
				var content="<tr><th>流程定义名称</th><th>流程定义版本</th><th>流程定义key</th>"
					"<th>操作</th></tr>";
				$.each(result.list,function(i,n){
					content+="<tr><td>"+n.name+"</td><td>"+n.version
						+"</td><td>"+n.key
						+"</td><td><button type='button' onclick='dele("+n.deploymentId+")'>删除</button>"
						+"<button type='button' onclick='look2("+n.deploymentId+")'>查看流程图</button></td></tr>";
				});
				$("#tab").html(content);
				
				var content2="当前第:"+result.pageNum+"页，总共："+result.pages+"页，总共："+result.total+"条记录";
				$("#fy1").html(content2);
				
				var content3="";
				content3+="<a href='#' onclick='pageChange(1)'>首页</a>";
				if(result.hasPreviousPage){
					content3+="<a href='#' onclick='pageChange("+(result.pageNum-1)+")'><span>&laquo;</span</a>";
				}
				$.each(result.navigatepageNums,function(i,n){
					if(n==result.pageNum){
						content3+="<a href='#'>"+n+"</a>"
					}else{
						content3+="<a href='#' onclick=pageChange("+n+")>"+n+"</a>";
					}
				});
				
				if(result.hasNextPage){
					content3+="<a href='#' onclick='pageChange("+(result.pageNum+1)+")'><span>&raquo;</span</a>";
				}
				content3+="<a href='#' onclick='pageChange("+result.pages+")'>末页</a>";
				$("#fy2").html(content3);
			}
		});
	}

	function deploy(){
		alert("adsf");
		//$("#f").click();
		
		//$("#f").append("<span id='d'>草拟吗</span>");
		$("#f").click();
		$("#f").change(function (){
			alert("asdfsfsd");
			 var o={
				type:"post",
				url:"${pageContext.request.contextPath}/process/deploy",
				success:function(result){
					alert("部署成功");
					start(1);
				}
			};
			$("#s").click();
			start(1);
				/* alert("aaa");
			 	$.ajax({
					//type:"post",
					url:"${pageContext.request.contextPath}/process/deploy",
					success:function(result){
						alert("部署成功");
						start(1);
					}
				});
			}); */
		});
	}

	function dele(xxx){
		$.ajax({
			type:"post",
			url:"${pageContext.request.contextPath}/process/delete",
			data:{"deploymentId":xxx},
			success:function(result){
				alert("删除流程定义版本"+result+"的流程成功");
				start(1);
			}
		});
	}
	
	/* function look(asdf){
		$.ajax({
			type:"post",
			url:"${pageContext.request.contextPath}/process/look",
			data:{"deploymentId":asdf},
			success:function(result){
				alert(result);
			}
		});
	} */
	function look2(asdf){
		$.ajax({
			type:"post",
			url:"${pageContext.request.contextPath}/process/look2",
			data:{"deploymentId":asdf},
			success:function(result){
				alert('<img alt="a" src="${pageContext.request.contextPath}/'+result+'">');
				$("img").prop("src","${pageContext.request.contextPath}/process/go?deploymentId="+asdf);
			}
		});
	}
</script>
<body>
	<div><button type="button" onclick="deploy()">添加流程部署</button></div>
	<div>
		<form action="${pageContext.request.contextPath}/process/deploy" 
			method="post" enctype="multipart/form-data" id="d" style="display: none;">
			<input type="file"  name="files" id="f">
			<input type="submit" id="s" value="tijiao">
		</form>
	</div>
	<div><table id="tab" border="1"></table></div>
    <div >
        <div id="fy1"></div>
        <div id="fy2"></div>
        <img alt="a" src="">
    </div>
</body>
</html>